<template>
  <div class="tree-menu">
   <a-tree
   :replaceFields="replaceFields"
   :defaultExpandedKeys="expandedKeys"
   :tree-data="treeData"
   @select="selectHandle">
   </a-tree>
  </div>
</template>

<script>
import {mapState, mapMutations, mapGetters} from 'vuex'
import {getNodes} from '@/services/monitoring'
import testTreeData from '../tree.json'
import evBus from '@/utils/bus'

export default {
  data(){
      return{
        testTreeData,
        treeData:[],
        replaceFields:{
            title:'name',
            key:'id',
            children:'children'
        },
        expandedKeys:["1","11"],
        
      }
  },
  computed:{
      ...mapState('account', ['treeNode']),
  },
  created(){
      console.log(this.treeNode)
      
    this.getNodeFun()
  },
  mounted(){
    
  },
  methods:{
      ...mapMutations('account', ['setTreeNode']),
    getNodeFun(){
        this.treeData = this.testTreeData
    },
    //
    selectHandle(selectedKeys,ev){
    //  console.log(selectedKeys,ev)
     evBus.$emit('msgView',selectedKeys,ev)
    },
  }
  
}
</script>

<style lang="less">
.tree-menu{
  padding: 30px;
  .ant-tree{
      color: #fff;
      .ant-tree-title{
        color: #fff;
      }
  }
}
</style>